<template>
  <div class="web hideScrollBar">
    <!-- 导航 -->
     <!-- 这里如果跳转三方的 h5 返回按钮就需要重新下逻辑 -->
    <NavBar
      v-if="isShowNavBar"
      :title="title"
      isFixed
      @getNavBarHeight="(h) => (pageData.navBarHeight = h)"
    />
    <div class="contentview" v-if="src">
      <iframe
        class="contentview-iframe"
        ref="myIframe"
        :src="src"
        frameborder="0"
        scrolling="auto"
      ></iframe>
    </div>
  </div>
</template>
<script setup name="web">
const route = useRoute();
console.log("页面参数:", route.query);

const src = computed(() => {
  return route.query.src || "";
});

// isShow: 0 隐藏导航  1 显示； 默认显示导航
const isShowNavBar = computed(() => {
  if (route.query && route.query.isShow && route.query.isShow != 1) {
    return false;
  }
  return true;
});

// firebase埋点
// const firebase = useInitFirebase(); // 初始化firebase
// firebase?.logEvent('BDC_H5_FAQJump');

// 桥接
// bridge.hideToolbar(); // 调用原生app的函数

// 页面属性
const pageData = reactive({
  navBarHeight: 0,
});

// 页面标题
const title = computed(() => {
  const iframeTitle =
    myIframe.value &&
    myIframe.value.contentDocument &&
    myIframe.value.contentDocument.title; // 获取 iframe 的标
  return route.query.title || iframeTitle || "";
});

// px 单位高度
const navBarHeight = computed(() => {
  return `${pageData.navBarHeight || 0}px`;
});

const myIframe = ref();

onMounted(() => {});
</script>
<style lang="scss" scoped>
.web {
  .contentview {
    width: 100vw;
    height: calc(100vh - v-bind("navBarHeight"));
    &-iframe {
      width: 100vw;
      height: 100%;
    }
  }
}
</style>
